<template>
  <div class="work-log">
    <div class="work-log-item" v-for="item in workLog" :key="item.time">
      <div class="time">{{item.time}}</div>
      <div class="content" :title="item.content">{{item.content}}</div>
    </div>
  </div>
</template>
<script>
export default {
  name: 'WorkLog',
  data(){
    return{
      workLog:[
        {time:'2025年6月15日',content:'金泉路社区广场反诈宣传活动（参与人员：民警程国帅、社区干部3名、网格员3名、居民60人）'},
        {time:'2025年6月15日',content:'发放手册130份，指导安装反诈APP32人次'},
        {time:'2025年6月15日',content:'反诈讲座视频（时长45分钟，覆盖80人），含民警演示诈骗话术破解'},
        {time:'2025年6月20日',content:'顺和家园模拟法庭（劳动纠纷案，50名居民陪审）'},
        {time:'2025年6月',content:'开展普法活动5场（社区2场、网格3场），覆盖居民480人'},
        {time:'2025年6月',content:'发放防电信诈骗宣传资料、反邪教宣传资料1100份，参与率85%（较上月提升10%）'},
        {time:'2025年6月',content:'飞天苑小区通过议事会推动解决垃圾房选址争议（居民满意度从45%提升至92%）'},
        {time:'2025年6月',content:'受理法律咨询6次，其中房产纠纷1次（占17%）、婚姻问题2次（33%）、劳务争议3次（50%），解答率98%（2次转司法所专项处理）'},
        // {time:'09:00',content:'开展社区法律咨询活动，解答居民关于物业纠纷问题'},
        // {time:'10:30',content:'组织社区老年人防诈骗知识讲座，参与人数达50人'},
        // {time:'14:30',content:'与社区志愿者一起开展入户普法宣传，覆盖100户居民'},
        // {time:'15:45',content:'处理一起邻里纠纷调解，成功化解矛盾'},
        // {time:'16:30',content:'开展青少年法律知识竞赛，参与学生30人'},
        // {time:'17:00',content:'组织社区法律知识问答活动，发放普法宣传资料200份'},
        // {time:'18:30',content:'与社区民警联合开展夜间巡逻，宣传安全防范知识'},
        // {time:'19:00',content:'召开社区法律顾问座谈会，收集居民法律需求'},
      ]
    }
  }
}
</script>
<style scoped lang="scss">
.work-log{
  width: 100%;
  height: 100%;
  overflow-y: auto;
  &::-webkit-scrollbar {
    width: 4px;
  }
  &::-webkit-scrollbar-thumb {
    border-radius: 3px;
    background: rgba(0,198,255,.3);
  }
  &::-webkit-scrollbar-track{
    border-radius: 3px;
    background: rgba(0,24,48,.3);
  }
  .work-log-item{
    width: 100%;
    height: 45px;
    border-radius: 8px;
    border: 1px solid #30AFF8;
    background: #06213B;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    padding: 0 20px;
    .time{
      width: 120px;
      color: #32B4FF;
      font-size: 14px;
      flex-shrink: 0;
    }
    .content{
      color: #fff;
      font-size: 14px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
  }
}
</style>
